I am attempting to build a timer application using Electron Forge. I found a tutorial here to follow: https://css-tricks.com/how-to-create-an-animated-countdown-timer-with-html-css-and-javascript/
However, as I am attempting to build this application, I get this error from Electron in the DevTools: "Uncaught ReferenceError: formatTime is not defined"
The first place this error gets thrown is in this section of my JavaScript file:
document.getElementById("app").innerHTML = ` <div class="base-timer">
<svg class="base-timer__svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<g class="base-timer__circle">
<circle class="base-timer__path-elapsed" cx="50" cy="50" r="45"></circle>
</g>
</svg>
<span id="base-timer-label" class="base-timer__label">
${formatTime(timeLeft)}
</span>`
I can't tell if this is a missing JavaScript library or why formatTime is undefined.
I want to be able to display a timer in one column and then another column with some text.
Could anyone help me understand why this is happening and what I need to do to be able to use this library? Or is there an alternative in Electron/Electron Forge?
I think the tutorial' owner did not add the function. In your link i found function at the "comments" section.
function formatTime(time) {
const hours = Math.floor(time / 60);
const minutes = Math.floor(time / 60);
let seconds = time % 60;
if (seconds < 10) {
seconds = 0${seconds};
}
return ${hours}:${minutes}:${seconds};
}